<template>
  <div class="container clearfix">
    <div class="tab">
      <div class="tab-item"
           v-for="(item, index) in tab_Arr"
           :key="index"
           @tap="toggle_tab(item.id)"
           :class="{'active':tab_select == item.id}">{{item.msg}}</div>
    </div>
    <doing v-if="tab_select==1"
           :doing_arr="doing_arr"></doing>
    <done v-if="tab_select==2"
          :done_arr="done_arr"></done>
  </div>
</template>

<script>
import common from '@/assets/js/mmk_common.js'
import doing from '@/components/subsidy/doing'
import done from '@/components/subsidy/done'
export default {
  data () {
    return {
      base_url: common.image_resource,
      tab_Arr: [
        {
          msg: "提速中",
          id: 1
        }, {
          msg: "提速完成",
          id: 2
        }
      ],
      tab_select: 1,
      doing_arr: [],
      done_arr: []
    };
  },
  methods: {
    toggle_tab (id) {
      this.tab_select = id
    },
    get_Data () {
      wx.showLoading({
        title: '', //提示的内容,
        mask: true, //显示透明蒙层，防止触摸穿透,
        success: res => { }
      });
      common.fly_post(
        "api/com.mmk.reservation.api.OpenUserAllowanceProvider/1.0.0/getAllowanceSpeedLogs.html",
        {},
        response => {
          wx.hideLoading();
          let res = response.data;
          if (res.code == 0) {
            let arr = res.data || []
            this.doing_arr = arr.filter((item) => {
              return !item.isSpeedUpSuccess
            })
            this.done_arr = arr.filter((item) => {
              return item.isSpeedUpSuccess
            })
          } else {
            common.mmk_Loading(2, res.msg);
          }
        }
        , 'isjava');
    }
  },
  onLoad () {
    wx.setNavigationBarTitle({
      title: "我的补贴单提速"
    });
  },
  onShow () {
    this.get_Data()
  },
  components: {
    doing, done
  }
};
</script>

<style lang="less" scoped>
.container {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  background: rgba(243, 244, 246, 1);
  .tab {
    margin: 16px 10px 10px;
    height: 36px;
    box-sizing: border-box;
    background: rgba(229, 229, 229, 1);
    border-radius: 10px;
    padding: 4px;
    display: flex;
    .tab-item {
      flex: 1;
      font-size: 14px;
      font-family: "PingFangSC-Regular", "PingFang SC";
      font-weight: 400;
      color: rgba(51, 51, 51, 1);
      line-height: 28px;
      text-align: center;
      &.active {
        background: rgba(255, 255, 255, 1);
        border-radius: 8px;
      }
    }
  }
}
</style>
